<template>
  <div class="GdwyyAppSqmx">
    <GdwyyAppSmallTitle title="社渠明细"></GdwyyAppSmallTitle>
    <van-loading v-if="loading" type="spinner" color="#1989fa" />
    <a-table
      v-else
      :columns="tableColumns"
      :data-source="data"
      :bordered="true"
      :pagination="false"
      size="small"
      :scroll="{ x: 300, y: 200 }"
    >
      <span slot="rowIndex" slot-scope="text, record, rowIndex">
        {{ rowIndex + 1 }}
      </span>
    </a-table>
  </div>
</template>

<script>
import { GdwyyAppBigTitle, GdwyyAppSmallTitle } from '@/components/reconsitution/index.js'
export default {
  name: 'GdwyyAppSqmx',
  components: {
    GdwyyAppSmallTitle
  },
  props: {
    data: {
      type: Array,
      default: () => {
        return []
      },
    },
    loading: {
      type: Boolean,
      default: true,
    },
  },

  data() {
    return {
      tableList: [],
      tableColumns: [
        {
          align: 'center',
          title: '序号',
          scopedSlots: { customRender: 'rowIndex' },
          width: '13.3333vw',
        },
        {
          title: '社会渠道名称',
          dataIndex: 'chnl_name',
          align: 'center',
          width: '80vw',
        },
        {
          title: '移网手机',
          dataIndex: 'KPI_VALUE',
          align: 'center',
          children: [
            {
              title: '移网主卡',
              dataIndex: 'YW_ZK_DEV',
              align: 'center',
              width: '26.6667vw',
            },
            {
              title: '5G主卡',
              dataIndex: '5G_ZK_DEV',
              align: 'center',
              width: '26.6667vw',
            },
            {
              title: '副卡',
              dataIndex: 'FK_ZK_DEV',
              align: 'center',
              width: '26.6667vw',
            },
          ],
        },
        {
          title: '宽带',
          children: [
            {
              title: '宽带',
              dataIndex: 'KD_DEV',
              align: 'center',
              width: '26.6667vw',
            },
            {
              title: '千兆',
              dataIndex: 'ZQZ_DEV',
              align: 'center',
              width: '26.6667vw',
            },
          ],
        },
        {
          title: '智家产品',
          children: [
            {
              title: 'FTTR',
              dataIndex: 'FTTR_DEV',
              align: 'center',
              width: '26.6667vw',
            },
            {
              title: '组网',
              dataIndex: 'WJZW_DEV',
              align: 'center',
              width: '26.6667vw',
            },
            {
              title: 'IPIV',
              dataIndex: 'IPTV_DEV',
              align: 'center',
              width: '26.6667vw',
            },
            {
              title: '沃家神眼',
              dataIndex: 'WOSY_DEV',
              align: 'center',
              width: '26.6667vw',
            },
          ],
        },
      ],
    }
  },

  mounted() {},

  methods: {},
}
</script>

<style lang="less" scoped>
.GdwyyAppSqmx {
  background: #fff;
  margin-bottom: 5.3333vw;
  padding: 2.6667vw;
  border-radius: 1.6vw;
  padding: 3.2vw 2.1333vw;
  box-sizing: border-box;
  margin-left: 2.6667vw;
  margin-right: 2.6667vw;
  ::v-deep {
    .ant-empty-description {
      text-align: center;
    }
  }
}
</style>